<template>
	<view>
		<!--个人中心-->
		<view class="container">
			<view class="go-login" @click="goLogin">
				<text class="btn-go-login" v-if="!isLogin">{{$t('settings.login')}}</text>
			</view>
			<!-- <view class="go-login" v-if="!hasLogin">
				<text class="btn-go-login" @click="changeLoginState">登录</text>
				<text class="btn-go-login" @tap="goLogin">登录</text>
			</view> -->

			<view class="userinfo" v-if="isLogin && !roleType">
				<view class="left-user">
					<image src="/static/def.png" mode="aspectFit" class="userinfo-avatar"></image>
					<view class="user-name">
						<view class="">
							匿名用户
						</view>
						<!-- <view v-if="userInfo.isUserMember" class="vip-level">超级VIP</view>
						<view v-else class="vip-level">非会员</view>
						<view v-if="userInfo.isUserMember" class="vip-level">
							{{ userInfo.userMember.expireTimeString_date }}到期
						</view> -->
					</view>
				</view>
				<!-- <image v-if="userInfo.isUserMember" class="userInfo-btn" src="/static/image/shezhi.png"
					@tap="userInfoModalChange"></image> -->
			</view>

			<view class="business-my" v-if="roleType">
				<view class="title">
					{{businessInfo.storeName}}
				</view>
				<!-- <view class="head" v-if="busCount">
					<view class="right">
						<view>
							<text
								class="name">{{businessInfo.memberDiscount==1?'增值版':businessInfo.cooperationType==3?'豪华版':businessInfo.cooperationType==2?'标准版':'体验版'}}</text>
							<image src="../../static/image/icon2/changjianwenti.png" @click="showTip" class="question">
							</image>
							<text class="name">，累计全额返￥</text>{{busCount.OfflineBusinessUserCashcouponTotalAmount/100}}
						</view>
					</view>
				</view> -->
			</view>
		</view>


		<view class="bgc" v-if="!roleType">
			<view class="vip-card" v-if="userInfo.isUserMember">
				<view class="user-price" @tap="goVipService">
					<view class="left">
						<view class="money-package">
							再花卡<text class="time">（{{ userInfo.userMember.expireTimeString_date }}到期）</text>
						</view>
						<view class="money-price">￥<text class="num">
								{{ userInfo.userCashCouponUsable ? userInfo.userCashCouponUsable / 100 : 0 }}</text>
						</view>
					</view>
					<view class="right" @click.stop="stayPrice">
						<image src="/static/code-icon.png"></image>
						<view>共享给他人</view>
					</view>
				</view>
				<image class="vip-more" src="/static/image/gengduo.png" @tap="goExchange"></image>
			</view>
			<!-- <view class="vip-card" v-if="userInfo.userCashCouponHelperUseable">
				<view class="user-price" @tap="goVipService">
					<view class="left">
						<view class="money-package">
							帮花卡
						</view>
						<view class="money-price">￥<text class="num">
								{{ userInfo.userCashCouponHelperUseable ? userInfo.userCashCouponHelperUseable / 100 : 0 }}</text>
						</view>
					</view>
				</view>
			</view> -->
		</view>

		<view class="bgc" v-if="roleType">
			<view class="centerTab">
				<view class="centerTab2" v-for="item,idx in businessMenus" :key="idx" @tap="goPageBytype(item)">
					<image class="left-icon" :src="item.icon"></image>
					<text class="center-text">{{item.name}}</text>
					<image class="right-iocn" src="/static/image/icon2/row.png"></image>
				</view>
			</view>
		</view>
		<view class="bgc" v-if="!roleType">
			<view class="centerTab">
				<view class="centerTab2" v-for="item,idx in menus" :key="idx" @tap="goPageBytype(item)">
					<image class="left-icon" :src="item.icon"></image>
					<text class="center-text">{{item.name}}</text>
					<image class="right-iocn" src="/static/image/icon2/row.png"></image>
				</view>
			</view>
		</view>

		<view class='btt-btn' v-if="userInfo.isOfflineBusiness&&environment=='weixin'">
			<view @click='switchAccount'>{{roleType?'切换为用户端':'切换为商家端'}}</view>
		</view>

		<view class='btt-btn' v-if="userInfo.isManager&&environment=='weixin'">
			<view @click='showDrawer'>自供给商品管理</view>
		</view>


		<view class='btt-btn' v-if="userInfo.isManager&&environment=='weixin'">
			<view @click='gobatch'>批量预生成码</view>
		</view>
		<uni-drawer ref="showRight" mode="right">
			<scroll-view style="height: 100%;" scroll-y="true">
				<view class="item-list" @click="goManageGood(item)" v-for="item,index in offlineBusinessList"
					:key="index">{{ item.storeName }}
				</view>
			</scroll-view>
		</uni-drawer>

		<view class="btnone" @click="logout">
			<view v-if="isLogin">{{$t('settings.logOut')}}</view>
		</view>
		<!-- 退出/登录 按钮 -->
		<!-- <view class="bottom-back" @click="logout">
			<text class="bottom-back-text" v-if="isLogin">{{$t('settings.logOut')}}</text>
		</view> -->

		<view class="cs-css" @click="goCustomerService" v-if="environment=='weixin'">
			客服
		</view>
		<view class="alipay-cs">
			<contact-button tnt-inst-id="V7S_Ewmo" scene="SCE00134179" size="40" v-if="environment=='alipay'" />
		</view>


	</view>

</template>

<script>
	import {
		store,
		mutations
	} from '@/uni_modules/uni-id-pages/common/store.js'
	//个人中心
	//获取应用实例
	const app = getApp();
	var Moment = require('../../utils/moment.js');

	var Util = require('../../utils/util.js');

	export default {
		data() {
			return {
				isLogin: false,
				userInfo: null,
				userInfoModalShow: false,
				expireTimeString_date: '',
				autoRenew: 0,
				menus: [{
					name: "我的订单",
					icon: "/static/image/order.png",
					url: "./userOrder/userOrder",
				}, {
					name: "意见反馈",
					icon: "/static/image/icon2/yijianfankui.png",
					url: "../personal/other/opinion/index",
				}, {
					name: "成为合伙人",
					icon: "/static/image/join.png",
					url: "../personal/other/join/index",
				}],
				businessMenus: [{
					name: "商品管理",
					icon: "/static/image/goods.png",
					url: "./goodsManage/goodsManage",
				}, {
					name: "点单码",
					icon: "/static/image/qrcode.png",
					url: "./orderCode/orderCode",
				}, {
					name: "门店信息",
					icon: "/static/image/shop.png",
					url: "./generateCode/generateCode",
				}, {
					name: "意见反馈",
					icon: "/static/image/icon2/yijianfankui.png",
					url: "../personal/other/opinion/index",
				}],
				roleType: null,
				businessInfo: null,
				offlineBusinessList: null,
				environment: null,
				sharId: null,
				busCount: null
			};
		},
		onLoad(e) {
			this.userInfo = uniCloud.getCurrentUserInfo()
			console.log('22222222' + JSON.stringify(this.userInfo));
			this.isLogin = (this.userInfo.uid != null)
			var info;
			//#ifdef  MP-WEIXIN
			this.environment = "weixin"
			info = decodeURIComponent(e.q);
			// #endif

			//#ifdef  MP-ALIPAY
			this.environment = "alipay"
			info = app.globalData.qrCode
			// #endif
			if (info) {
				this.sharId = info.split('id=')[1];
			}
		},
		onPullDownRefresh() {
			this.getUser();
			setTimeout(function() {
				uni.stopPullDownRefresh();
			}, 1000);

		},
		onShow() {
			this.getUser();
			if (this.sharId) {
				this.binding();
			}
			this.getSelfSupportOfflineBusinessList();
			this.roleType = uni.getStorageSync('userRole');
		},
		methods: {
			// 退出登录
			async logout() {
				await mutations.logout()
				let redirectPageUrl = uni.getStorageSync("/pages/newMy/newMy");
				if (!redirectPageUrl || 0 === redirectPageUrl.length) {
					uni.navigateBack();
				} else if (redirectPageUrl.indexOf("/pages/newIndex/newIndex") >= 0) {
					console.log("switch tab:" + redirectPageUrl)
					uni.switchTab({
						url: redirectPageUrl
					})
				} else {
					uni.redirectTo({
						url: redirectPageUrl
					})
				}
			},
			goLogin() {
				console.log('111111111');
				uni.navigateTo({
					url: '/uni_modules/uni-id-pages/pages/userinfo/userinfo',
					fail(res) {
						console.log('111' + JSON.stringify(res));
					},
					success(res) {
						console.log('111' + JSON.stringify(res));
					},
					complete(res) {
						console.log('111' + JSON.stringify(res));
					}
				})
				/* uni.navigateTo({
					url: '../login/index'
				}); */
			},
			/* goLogin() {
				console.log(this.isLogin);
				if (this.isLogin) {
					await mutations.logout()
				} else {
					uni.redirectTo({
						url: '/uni_modules/uni-id-pages/pages/login/login-withoutpwd',
						fail(res) {
							console.log('1111' + JSON.stringify(res));
						},
						success(res) {
							console.log('1111' + JSON.stringify(res));
						},
						complete(res) {
							console.log('1111' + JSON.stringify(res));
						}
					});
				}
			}, */

			/* logout() {
				mutations.logout()
				this.isLogin = false
				uni.reLaunch({
					url: '/pages/newMy/newMy'
				})
			}, */
			showTip() {
				let str = "";
				if (this.businessInfo.memberDiscount == 1) {
					str = "增值版最高全额返红包上限  10万/月"
				} else if (this.businessInfo.cooperationType == 3) {
					str = "豪华版最高全额返红包上限  30万/月"
				} else if (this.businessInfo.cooperationType == 2) {
					str = "标准版最高全额返红包上限  10万/月"
				} else if (this.businessInfo.cooperationType == 1) {
					str = "体验版最高全额返红包上限  5万/月"
				}
				uni.showModal({
					title: '提示',
					content: str,
					confirmText: '我知道了',
					showCancel: false
				})
			},
			binding() {
				console.log(this.sharId)
				uni.request({
					url: app.globalData.serviceUrl +
						'/UserMiniProgramController/doBindUserCashCouponHelper',
					data: {
						key: uni.getStorageSync('userKey'),
						helper_id: this.sharId
					},
					method: 'POST',
					header: {
						'content-type': 'application/x-www-form-urlencoded'
					},
					success: (res) => {
						var data = res.data;
						if (data.state == 2) {
							this.goLogin();
						} else {
							uni.showModal({
								title: '提示',
								content: data.state == 1 ? "已共享红包，现在可以去帮花啦" : res.data.notice,
								confirmText: '我知道了',
								showCancel: false
							})
							this.sharId = null;
						}
					}
				});
			},
			stayPrice() {
				uni.navigateTo({
					url: './stayPrice/stayPrice?id=' + this.userInfo.userId
				});
			},
			goCustomerService() {
				uni.navigateTo({
					url: './antCustomerService/antCustomerService'
				});
			},
			goExchange() {
				uni.navigateTo({
					url: '../personal/other/exchange/index'
				});
			},
			goMenu(url) {
				uni.redirectTo({
					url: url
				});
			},
			goPageBytype(item) {
				console.log(item)
				if (!this.isLogin) {
					this.goLogin();
					return;
				}
				if (item.name == "商品管理") {
					uni.navigateTo({
						url: item.url + '?id=' + this.businessInfo.id + '&memberDiscount=' + this.businessInfo
							.memberDiscount
					});
				} else if (item.name == "点单码" || item.name == "分销") {
					uni.navigateTo({
						url: item.url + '?id=' + this.businessInfo.id
					});
				} else {
					uni.navigateTo({
						url: item.url
					});
				}
			},
			goVip() {
				if (this.isLogin) {
					uni.navigateTo({
						url: '../vip/addVip/index'
					});
				} else {
					this.goLogin();
				}
			},

			goVipService() {
				if (this.isLogin) {
					uni.navigateTo({
						url: '../vip/index'
					});
				} else {
					this.goLogin();
				}
			},
			switchAccount() {
				this.roleType = uni.getStorageSync('userRole');
				this.roleType = !this.roleType;
				uni.setStorageSync("userRole", this.roleType)
			},
			showDrawer() {
				this.$refs.showRight.open();
			},
			gobatch() {
				uni.navigateTo({
					url: "./batchPreGeneration/batchPreGeneration?id=" + this.businessInfo.id
				})
			},
			goManageGood(item) {
				uni.navigateTo({
					url: "./goodsManage/goodsManage?id=" + item.id
				})
			},


			getUser() {
				// this.isLogin = (userInfo.uid == null)
				/* uni.request({
					url: app.globalData.serviceUrl + '/UserMiniProgramController/getUserInfo',
					data: {
						key: uni.getStorageSync('userKey')
					},
					method: 'POST',
					header: {
						'content-type': 'application/x-www-form-urlencoded'
					},
					success: (res) => {
						var data = res.data;
						if (data.state == 1) {
							this.isLogin = true;
							this.setData({
								userInfo: data.data,
								businessInfo: data.data.offlineBusiness
							});
							if (this.businessInfo.id) {
								this.getAmount(this.businessInfo.id)
							}
						} else if (data.state == 2) {
							this.isLogin = false;
						}
					}
				}); */
			},
			getAmount(id) {
				uni.request({
					url: app.globalData.serviceUrl +
						'/UserMiniProgramController/getOfflineBusinessUserCashcouponTotalAmount',
					data: {
						offline_businss_id: id,
						// create_time_start: null,
						// create_time_end: null
					},
					method: 'POST',
					header: {
						'content-type': 'application/x-www-form-urlencoded'
					},
					success: (res) => {
						this.busCount = res.data.data
					}
				});
			},
			getSelfSupportOfflineBusinessList() {
				var that = this;
				uni.request({
					url: app.globalData.serviceUrl +
						'/UserMiniProgramController/getOfflineBusinessInfoList',
					method: 'POST',
					data: {
						type: 3, // - 类型 0 全部(默认) 1 正常 2 自营 3 自营不展示
						page: 1, // - 当前页（ 可不传 默认第1页）
						page_size: 20, // - 页大小（ 可不传 默认20）
					},
					header: {
						'content-type': 'application/x-www-form-urlencoded'
					},
					success: (res) => {
						this.offlineBusinessList = res.data.data;
					}
				});
			},

			userInfoModalChange() {
				this.setData({
					userInfoModalShow: !this.userInfoModalShow
				});
			},

			userInfoModalClose() {
				this.setData({
					userInfoModalShow: false
				});
			},
		},
		computed: {
			hasLogin() {
				return store.hasLogin
			}
		}
	};
</script>
<style lang="scss" scoped>
	page {
		background: rgba(242, 243, 248, 1);
	}

	.avatar-btn {
		background-color: white;
		border: none;
		padding: 0;
		box-sizing: none;
	}

	.btnRight {
		box-sizing: none;
		background-color: white;
		outline: none;
		border: none;
		margin: 0;
		border-bottom: 1px solid #eee;
		text-align: left;
	}

	.btnRight .right-iocn {
		position: relative;
		top: 20px;
	}

	button ::after {
		border: none;
	}

	.container {
		background-color: white;
	}

	.go-login {
		height: 100px;
		width: 100%;
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.userinfo {
		padding: 10px 15px;
		display: flex;
		align-items: center;
		justify-content: space-between;
	}

	.userinfo .userInfo-btn {
		width: 50rpx;
		height: 50rpx;
	}

	.userInfo-modal {
		width: 100%;
		height: 100%;
		position: fixed;
		left: 0;
		top: 0;
		background-color: rgba(0, 0, 0, 0.7);
		z-index: 9999;
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.userInfo-modal-body {
		width: 580rpx;
		height: 200rpx;
		background-color: #fff;
		border-radius: 10rpx;
		display: flex;
		align-items: center;
		justify-content: space-around;
	}

	.userInfo-modal-title {
		font-size: 45rpx;
		font-weight: bold;
	}

	.time-out {
		font-size: 12px;
		color: #999;
		margin-bottom: 10px;
	}

	.userinfo-avatar {
		display: inline-block;
		width: 50px;
		height: 50px;
		border-radius: 50%;
		overflow: hidden;
		margin-right: 10px;
	}

	.left-user {
		display: flex;
		align-items: center;
		color: #333;
		font-size: 14px;
		font-weight: bold;
	}

	.user-name .vip-level {
		color: #333;
		font-size: 12px;
		font-weight: normal;
		margin-top: 5px;
	}

	.vip-card {
		padding: 12px 15px;
		margin-bottom: 15px;
		color: #fff;
		background: rgba(255, 255, 255, 1);
		box-shadow: 0px 1px 4px 0px rgba(255, 255, 255, 0.13);
		border-radius: 10px;
		background-color: #222;
		position: relative;

		.vip-more {
			width: 80rpx;
			height: 80rpx;
			position: absolute;
			right: 0;
			top: 0;
		}

		.user-price {
			display: flex;
			align-items: flex-end;
			justify-content: space-between;
			padding-right: 80rpx;

			.left {}

			.right {
				text-align: center;
				font-size: 12px;

				image {
					width: 40px;
					height: 40px;
				}
			}
		}
	}


	.other-order-btn {
		text-align: center;
		border: 1px solid #b3b3b3;
		display: inline-block;
		border-radius: 30px;
		line-height: 30px;
		height: 30px;
		font-size: 14px;
		color: #000;
		background-color: #fff;
		width: 100px;
	}

	.bgc {
		padding: 15px 15px 0 15px;
	}

	.centerTab {
		font-size: 12px;
		color: #333;
		background: rgba(255, 255, 255, 1);
		box-shadow: 0px 1px 4px 0px rgba(94, 94, 94, 0.13);
		border-radius: 10px;
		background-color: white;
	}

	.tab_title {
		font-size: 15px;
		font-weight: bold;
		color: rgba(51, 51, 51, 1);
		border-bottom: 1px solid #eee;
		padding-bottom: 12px;
	}

	.tab_all {
		font-size: 10px;
		font-weight: 500;
		color: rgba(102, 102, 102, 1);
		float: right;
	}

	.tab_all text {
		position: relative;
		top: 3px;
		right: 8px;
	}

	.tab_content {
		display: flex;
		margin-top: 15px;
	}

	.item-one {
		width: 25%;
		text-align: center;
	}

	.nums {
		font-weight: 500;
		font-size: 18px;
	}

	.centerTab2 {
		padding: 15px;
		border-bottom: 1px solid #eee;
	}

	.left-icon {
		width: 18px;
		height: 18px;
		position: relative;
		top: 3px;
		margin-right: 11px;
	}

	.center-text {
		font-size: 12px;
		color: #333;
	}

	.right-iocn {
		width: 5px;
		height: 9px;
		position: relative;
		top: 6px;
		float: right;
	}

	.icon_top {
		position: relative;
		top: -5px;
	}

	.btt-btn {
		padding: 0 50px;
		margin-top: 15px;
		margin-bottom: 30px;
	}

	.btt-btn view {
		line-height: 40px;
		text-align: center;
		width: 100%;
		height: 100%;
		border: 1px solid #dddee1;
		font-size: 12px;
		color: #1c2438;
	}

	.changeBtn {
		position: fixed;
		top: 10px;
		right: 10px;
		font-size: 18px;
		color: #222;
	}

	.changeBtn image {
		width: 22px;
		height: 22px;
		position: relative;
		top: 3px;
	}

	.btn-go-login {
		display: inline-block;
		padding: 6px 15px;
		font-size: 12px;
		margin-bottom: 10px;
		border-radius: 30px;
		width: 80px;
		background-color: #000;
		color: white;
		text-align: center;
	}

	.btn-000 {
		background: #222;
		color: #fff;
	}




	.item-list {
		line-height: 50px;
		text-align: center;
		margin: 10px;
		background: #333333;
		color: #fff;
		border-radius: 10px;
	}

	.cs-css {
		padding: 0;
		box-sizing: none;
		font-size: 12px;
		position: fixed;
		right: 15px;
		bottom: 80px;
		background: #333;
		color: white;
		height: 50px;
		line-height: 50px;
		width: 50px;
		border-radius: 50%;
		border: 1px solid #ddd;
		text-align: center;
	}


	.alipay-cs {
		position: fixed;
		right: 15px;
		bottom: 80px;
		text-align: center;
	}


	.money-pic {
		width: 40px;
		height: 40px;
	}

	.money-package {
		font-size: 18px;

	}

	.money-package .time {
		font-size: 12px;
	}

	.money-price {
		font-size: 14px;
		margin-top: 15px;
	}

	.money-price .num {
		font-size: 38px;
	}






	.business-my {
		.title {
			font-size: 24px;
			margin-bottom: 20px;
			text-align: center;

			.ver {
				font-size: 12px;
			}
		}

		.head {
			display: flex;
			align-items: center;
			justify-content: space-around;
			text-align: center;
			font-size: 18px;
			font-weight: bold;

			.name {
				font-size: 14px;
				font-weight: 400;
				margin: 10px 0;
			}

			.question {
				width: 17px;
				height: 17px;
				margin-left: 3px;
				position: relative;
				top: 3px;
			}
		}
	}

	.bottom-back {
		margin-top: 10px;
		width: 750rpx;
		height: 44px;
		/* #ifndef APP-NVUE */
		display: flex;
		/* #endif */
		flex-direction: column;
		justify-content: center;
		align-items: center;
		/* #ifndef APP-NVUE */
		border: none;
		/* #endif */
		border-width: 0;
		border-radius: 0;
		background-color: #FFFFFF;
	}

	.bottom-back-text {
		font-size: 33rpx;
	}

	.btnone {
		position: fixed;
		bottom: 10px;
		width: 100%;
	}

	.btnone view {
		background-color: #000;
		color: white;
		line-height: 40px;
		margin: 0 20px;
		text-align: center;
		font-size: 14px;
	}
</style>